<template>
  <div id="box">
    <h1>App</h1>
    <button @click="count++">{{ count }}</button>
    <ComA></ComA>
  </div>
</template>
<script setup>
import { ref, shallowRef, provide, readonly } from 'vue';
import { titleKey, countKey } from '@/key.js';
import ComA from './components/ComA.vue';
const count = ref(10)

provide(countKey, {
  count: readonly(count),
  updateCount: (vaule) => count.value = vaule,
})

</script>

<style>
div {
  border: solid;
  padding: 10px;
}
</style>